<template>
  <div>
    <ContentTitle :info="ctInfo" />
    <el-table :data="measurementList"  style="width: 100%">
        <el-table-column type="index" label="序号"  width="180"> </el-table-column>
        <el-table-column prop="id" label="测量ID"> </el-table-column>
        <el-table-column prop="name" label="测量名称"> </el-table-column>
        <el-table-column prop="unit" label="测量单位"> </el-table-column>
        <el-table-column label="创建时间">
           <template slot-scope="scope">
            {{ scope.row.cTime | uTimeType }}
          </template>
        </el-table-column><el-table-column label="更新时间">
           <template slot-scope="scope">
            {{ scope.row.uTime | uTimeType }}
          </template>
        </el-table-column>
        <el-table-column label="操作">
            <el-button type="primary" icon="el-icon-edit" circle></el-button>
            <el-button type="danger" icon="el-icon-delete" circle></el-button>
             </el-table-column>
      </el-table>
  </div>
</template>

<script>
import ContentTitle from "@/components/ContentTitle.vue";
import { $measurementList } from "@/api/index.js";
export default {
  name: "index",
  components: { ContentTitle },
  data() {
    return {
      ctInfo: {
        type: "自定义类型",
        text: "测量类型",
        msg: "展示所有自定义的测量类型，提供了添加测量类型、修改测量类型、删除测量类型等功能。",
      },
      measurementList: [],
    };
  },
    filters: {
    uTimeType(value) {
      let date = new Date(value);
      let y = date.getFullYear(); // 获取完整的年份(4位,1970)
      let m = date.getMonth(); // 获取月份(0-11,0代表1月,用的时候记得加上1)
      let d = date.getDate(); // 获取日(1-31)
      let y1 = y < 10 ? "0" + y : y;
      let m1 = m < 10 ? "0" + m : m;
      let d1 = d < 10 ? "0" + d : d;
      return `${y1} - ${m1} - ${d1}`;
    },
  },
  created() {
    this.getMeasurement();
  },
  methods: {
    getMeasurement() {
      $measurementList().then((res) => {
        this.measurementList = res.data.data;
      });
    },
  },
};
</script>

<style>
</style>